<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			body{
				background-color: #4E73DF;
			}
			.lamp{
				width: 700px;
				height: 500px;
				background-color: #FFFFFF;
				border-radius: 2%;
				margin: 0 auto;
				margin-top: 36px;
				position: relative;
			}
			.picture{
				width: auto;
				height: 500px;
				border-radius: 2% 0% 0% 2%;
				
			}	
			.z{
				position: absolute;
				padding-left: 20%;
				padding-top: 10%;
				font-size: 20px;
			}
			.content{
				float: right;
				margin-top: 150px;
				margin-right: 100px;
			}	
			.p{
				
     border: 0px;
    border-radius: 20px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    padding: 0.7rem 2rem;
    margin-bottom: 20px;
    }
    .d{
    	width: 100%;
 background-color: #E74A3B;
     border: 0px;
    border-radius: 20px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    padding-right: 50px;
    padding-bottom: 20px;
    margin-bottom: 20px;
  padding: 0.375rem 0.75rem;
 display: block;
    }
    .f{
    	width: 100%;
 background-color: #4E73DF;
     border: 0px;
    border-radius: 20px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    padding-right: 50px;
    padding-bottom: 20px;
    margin-bottom: 20px;
  padding: 0.375rem 0.75rem;
 display: block;

    
    }
    input{
    	outline: none;
    	}
		</style>
	</head>
	<body>
		<div class="lamp">
			<img src="img/login.jpg" class="picture"/>
			<span class="z">Welcome Back!</span>
			<div class="content">
				
				
				<input type="type" name="" id="" value="" class="p" placeholder="输入用户名"/></br>
				
				<input type="password" name="" id="" value="" class="p" placeholder="输出密码"/></br>
				
				
				<a href="#" style="text-decoration: none;"><input class="f" type="button" name="" id="" value="登录" /></a>
                       <a href="#" style="text-decoration: none;"><input class="d" type="button" name="" id="" value="退出" /></a>
			</div>
		</div>
	</body>
</html>
